import 'package:calendar_girl/views/play/model/MusicModel.dart';
import 'package:flutter/material.dart';
import 'package:weui/slider/index.dart';

class Lyrics extends StatefulWidget {
  Lyrics({@required this.music, this.onClick});
  final MusicModel music;
  final Function onClick;
  @override
  State<StatefulWidget> createState() {
    return LyricsState();
  }
}

class LyricsState extends State<Lyrics> with SingleTickerProviderStateMixin{
  ScrollController _scrollController;
  GlobalKey _scrollKey = GlobalKey();
  @override
  void initState() {
    super.initState();
    _scrollController = new ScrollController();
  }
  @override
  void didUpdateWidget(Lyrics oldWidget) {
    super.didUpdateWidget(oldWidget);
    if(mounted){
      _updateScroll();
    }
  }

  void _updateScroll() {
    // print(_scrollKey.currentContext.size.height);
    int lyricIndex = widget.music.getActiveLyricIndex();
    _scrollController.animateTo((lyricIndex*47).toDouble(), duration: Duration(milliseconds: 300), curve: Curves.ease);
  }
  @override
  Widget build(BuildContext context) {
    
    return Stack(
      children: <Widget>[
        Column(
          mainAxisAlignment: MainAxisAlignment.spaceAround,
          crossAxisAlignment: CrossAxisAlignment.center,
          children: <Widget>[
            Row(
              mainAxisAlignment: MainAxisAlignment.spaceAround,
              crossAxisAlignment: CrossAxisAlignment.center,
              children: <Widget>[
                IconButton(icon: Icon(Icons.volume_up, color: Colors.white, size: 14,)),
                Expanded(
                  child: WeSlider(
                    buttonSize: 8,
                    higColor: Colors.white,
                    color: Colors.grey,
                  ),
                ),
              ],
            ),
            Expanded(
              child: GestureDetector(
                onTap: () {
                  widget.onClick(true);
                },
                child: ListView(
                  key: _scrollKey,
                  controller: _scrollController,
                  children: widget.music.lyrics.map((lyric) {
                    return ListTile(title: new Text(lyric.content, textAlign: TextAlign.center, style: TextStyle(color: Colors.grey[400]),));
                  }).toList(),
                ),
              ),
            )
          ],
        ),
        Positioned(
          bottom: 20,
          right: 0,
          child: IconButton(icon: Icon(Icons.info_outline), onPressed: () {
            // _updateScroll();
          },),
        )
      ],
    );
  }
}